<template>
  <el-dialog
    title="分配货主库位"
    :visible.sync="dialogData.visible"
    class="dialogForm"
    width="500px"
    :before-close="handleClose"
  >
    <div class="unfreeze-form">
      <el-cascader
        v-model="values"
        :options="areaData"
        :props="props"
        clearable
      ></el-cascader>
    </div>
    <span
      slot="footer"
      class="dialog-footer"
    >
      <base-button
        class="unimportanceButton btnCancle"
        @click="handleClose"
      >取 消</base-button>
      <base-button
        class="minorImportantButton"
        type="primary"
        @click="handleSubmit"
      >确 定</base-button>
    </span>
  </el-dialog>
</template>
<script lang="ts">
import { Component, Vue, Prop } from 'vue-property-decorator'
// 公用组件
// 按钮
import BaseButton from '@/components/base-button/index.vue'
// api接口
// import { getAllAreaList } from '@/module-base/api/area'
import { getAllWarehouse } from '@/module-base/api/warehouse'
import { getAllLocationList } from '@/module-base/api/location'
import { getTreeList, batchOwnerLocation } from '@/module-business/api/owner'
@Component({
  name: 'Dialog',
  components: {
    BaseButton
  }
})
export default class extends Vue {
  @Prop() private dialogData!: any
  @Prop() private ownerId!: ''
  private areaData = [] as any
  private values = [] as string[] // 可以回显

  private props = {
    multiple: true
    // lazy: true,
    // checkStrictly: false,
    // label: 'label',
    // value: 'value',
    // async lazyLoad(node: any, resolve: any) {
    //   //   setTimeout(async() => {
    //   if (node.level === 0) {
    //     const { data } = await getAllWarehouse()
    //     const warehouse = data.map((value: any) => ({
    //       value: value.id,
    //       label: value.name,
    //       leaf: node.level >= 2
    //     }))

    //     // 通过调用resolve将子节点数据返回，通知组件数据加载完成
    //     resolve(warehouse)
    //   }
    //   if (node.level === 1) {
    //     const { data } = await getAllAreaList({ warehouseId: node.value })
    //     const area = data.map((value: any) => ({
    //       value: value.id,
    //       label: value.name,
    //       leaf: node.level >= 2
    //     }))
    //     // 通过调用resolve将子节点数据返回，通知组件数据加载完成
    //     resolve(area)
    //   }
    //   if (node.level === 2) {
    //     const { data } = await getAllLocationList({ areaId: node.value })
    //     const location = data.map((value: any) => ({
    //       value: value.id,
    //       label: value.name,
    //       leaf: node.level >= 2
    //     }))
    //     // 通过调用resolve将子节点数据返回，通知组件数据加载完成
    //     resolve(location)
    //   }
    //   //   }, 500)
    // }
  }

  mounted() {
    this.getList()
  }

  private async getlocationList(id: string) {
    const { data } = await getAllLocationList({ areaId: id })
    return data
  }

  private async getAreaList(id: string) {
    const { data } = await getTreeList(id)
    return data
  }

  // 获取数据
  private async getList() {
    const { data } = await getAllWarehouse({ status: 1 })
    const detailDatas = data
    var i: number
    var o: number
    // 组合树数据
    for (i = 0; i < detailDatas.length; i++) {
      const { data } = await getTreeList(detailDatas[i].id)
      const obj = {
        value: detailDatas[i].id,
        label: detailDatas[i].name,
        children: data
      }
      this.areaData.push(obj)
    }
    const areaData = this.areaData
    for (o = 0; o < areaData.length; o++) {
      if (areaData[o].children && areaData[o].children.length === 0) {
        delete areaData[o].children
      }
      const child = areaData[o].children
      if (child !== undefined) {
        for (var j = 0; j < child.length; j++) {
          if (child[j].ownerId !== null) {
            this.$set(child[j], 'disabled', true)
          }
          child[j].children.forEach((e: any) => {
            if (e.ownerId !== null) {
              this.$set(e, 'disabled', true)
            }
          })
          if (child[j].children && child[j].children.length === 0) {
            delete child[j].children
          }
        }
      }
    }
    // 递归
    // let _this = this
    // this.areaData.forEach(function isHas(obj:any) {
    //   if ((obj.children && obj.children.length === 0) || obj.children === null) {
    //     delete obj.children
    //     // _this.$delete(obj, 'children')
    //   }
    //   if ((obj.children && obj.children.length > 0) || obj.children !== undefined) {
    //     // console.log(obj.children)
    //     isHas(obj.children)
    //   }
    //   // console.log(_this.areaData)
    // })
    // // console.log(this.options)
  }

  // 提交数据
  private async handleSubmit() {
    console.log(this.dialogData, this.ownerId)
    const datas = [] as any
    this.values.forEach((item: any) => {
      if (item.length === 3) {
        datas.push(item.toString())
      }
    })
    this.values = datas
    const params = {
      ownerId: this.ownerId,
      idStrArray: this.values
    }
    await batchOwnerLocation(params)
    this.handleClose()
    this.getList()
  }

  // 表单取消
  private handleClose() {
    this.dialogData.visible = false
    this.$emit('getlist', this.ownerId)
    this.values = []
  }
}
</script>
<style lang="scss">
</style>
